<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <!--[if IE]><meta http-equiv="X-UA-Compatible" content="IE=edge" /><![endif]-->
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width,initial-scale=1"><!-- Place ../favicon.ico in the root directory -->
    <link rel="apple-touch-icon" href="../apple-touch-icon.png">
    <link rel="icon" href="../favicon.ico">
    <link href="https://fonts.googleapis.com/css?family=Poppins:100,300,400,700,900" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css?family=Caveat" rel="stylesheet">
    <title>Dashcore - Premium Software & Startup HTML</title><!-- themeforest:css -->
    <link rel="stylesheet" href="../css/all.css">
    <link rel="stylesheet" href="../css/aos.css">
    <link rel="stylesheet" href="../css/cookieconsent.min.css">
    <link rel="stylesheet" href="../css/magnific-popup.css">
    <link rel="stylesheet" href="../css/odometer-theme-minimal.css">
    <link rel="stylesheet" href="../css/prism-okaidia.css">
    <link rel="stylesheet" href="../css/simplebar.css">
    <link rel="stylesheet" href="../css/smart_wizard.css">
    <link rel="stylesheet" href="../css/smart_wizard_theme_arrows.css">
    <link rel="stylesheet" href="../css/smart_wizard_theme_circles.css">
    <link rel="stylesheet" href="../css/smart_wizard_theme_dots.css">
    <link rel="stylesheet" href="../css/swiper.css">
    <link rel="stylesheet" href="../css/theme.css">
    <link rel="stylesheet" href="../css/rtl.css"><!-- endinject -->
</head>

<body>
    <!--[if lt IE 8]>
<p class="browserupgrade">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
    <nav class="st-nav navbar main-nav navigation fixed-top">
        <div class="container">
            <ul class="st-nav-menu nav navbar-nav">
                <li class="st-nav-section nav-item"><a href="#main" class="navbar-brand"><img src="../img/logo.png" alt="Dashcore" class="logo logo-sticky d-block d-md-none"></a></li>
                <li class="st-nav-section st-nav-primary nav-item"><a class="st-root-link item-products nav-link">Home </a><a class="st-root-link item-pages st-has-dropdown nav-link" data-dropdown="pages">Pages </a><a class="st-root-link item-blocks st-has-dropdown nav-link" data-dropdown="blocks">Blocks </a><a class="st-root-link item-components st-has-dropdown nav-link" data-dropdown="components">UI Components </a><a class="st-root-link item-blog st-has-dropdown nav-link" data-dropdown="blog">Blog </a><a class="st-root-link item-shop st-has-dropdown nav-link" href="../shop/" data-dropdown="shop">Shop</a></li><!-- Mobile Navigation -->
                <li class="st-nav-section st-nav-mobile nav-item"><button class="st-root-link navbar-toggler" type="button"><span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span></button>
                    <div class="st-popup">
                        <div class="st-popup-container"><a class="st-popup-close-button">Close</a>
                            <div class="st-dropdown-content-group">
                                <h4 class="text-uppercase regular">Pages</h4><a class="regular text-primary" href="../about.html"><i class="far fa-building icon"></i> About </a><a class="regular text-success" href="../contact.html"><i class="far fa-envelope icon"></i> Contact </a><a class="regular text-warning" href="../pricing.html"><i class="fas fa-hand-holding-usd icon"></i> Pricing </a><a class="regular text-info" href="../faqs.html"><i class="far fa-question-circle icon"></i> FAQs</a>
                            </div>
                            <div class="st-dropdown-content-group b-t bw-2">
                                <h4 class="text-uppercase regular">Components</h4>
                                <div class="row">
                                    <div class="col mr-4"><a target="_blank" href="../components/alert.html">Alerts</a> <a target="_blank" href="../components/badge.html">Badges</a> <a target="_blank" href="../components/button.html">Buttons</a> <a target="_blank" href="../components/color.html">Colors</a> <a target="_blank" href="../components/accordion.html">Accordion</a> <a target="_blank" href="../components/cookie-law.html">Cookielaw</a></div>
                                    <div class="col mr-4"><a target="_blank" href="../components/overlay.html">Overlay</a> <a target="_blank" href="../components/progress.html">Progress</a> <a target="_blank" href="../components/lightbox.html">Lightbox</a> <a target="_blank" href="../components/tab.html">Tabs</a> <a target="_blank" href="../components/tables.html">Tables</a> <a target="_blank" href="../components/typography.html">Typography</a></div>
                                </div>
                            </div>
                            <div class="st-dropdown-content-group bg-light b-t"><a target="_blank" href="../components/wizard.html">Wizard <span class="badge badge-pill badge-primary">New</span></a></div>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
        <div class="st-dropdown-root">
            <div class="st-dropdown-bg">
                <div class="st-alt-bg"></div>
            </div>
            <div class="st-dropdown-arrow"></div>
            <div class="st-dropdown-container">
                <div class="st-dropdown-section" data-dropdown="pages">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="mb-4">
                                <h3 class="text-darker light text-nowrap"><span class="bold regular">Useful pages</span> you'll need</h3>
                                <p class="text-secondary mt-0">Get a complete design stack</p>
                            </div>
                            <div class="row">
                                <div class="col">
                                    <ul class="mr-4">
                                        <li>
                                            <h4 class="text-uppercase regular">Error</h4>
                                        </li>
                                        <li><a target="_blank" href="../403.html">403 Error</a></li>
                                        <li><a target="_blank" href="../404.html">404 Error</a></li>
                                        <li><a target="_blank" href="../405.html">405 Error</a></li>
                                    </ul>
                                </div>
                                <div class="col">
                                    <ul class="mr-4">
                                        <li>
                                            <h4 class="text-uppercase regular">User</h4>
                                        </li>
                                        <li><a target="_blank" href="../login.html">Login</a></li>
                                        <li><a target="_blank" href="../register.html">Register</a></li>
                                        <li><a target="_blank" href="../forgot.html">Forgot</a></li>
                                    </ul>
                                </div>
                                <div class="col">
                                    <ul>
                                        <li>
                                            <h4 class="text-uppercase regular">Extra</h4>
                                        </li>
                                        <li><a target="_blank" href="../pricing.html">Pricing</a></li>
                                        <li><a target="_blank" href="../terms.html">Terms</a></li>
                                        <li><a target="_blank" href="../faqs.html">FAQ</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group"><a class="dropdown-item bold" target="_blank" href="../about.html"><i class="far fa-building icon"></i> About </a><a class="dropdown-item bold" target="_blank" href="../contact.html"><i class="far fa-envelope icon"></i> Contact </a><a class="dropdown-item bold" target="_blank" href="../pricing.html"><i class="fas fa-hand-holding-usd icon"></i> Pricing</a></div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="blocks">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="row">
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="../blocks/call-to-action.html">Call to actions</a> <a class="dropdown-item" target="_blank" href="../blocks/contact.html">Contact</a> <a class="dropdown-item" target="_blank" href="../blocks/counter.html">Counters</a> <a class="dropdown-item" target="_blank" href="../blocks/faqs.html">FAQs</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="../blocks/footer.html">Footers</a> <a class="dropdown-item" target="_blank" href="../blocks/form.html">Forms</a> <a class="dropdown-item" target="_blank" href="../blocks/navbar.html">Navbar</a> <a class="dropdown-item" target="_blank" href="../blocks/navigation.html">Navigation</a></div>
                                <div class="col"><a class="dropdown-item" target="_blank" href="../blocks/pricing.html">Pricing</a> <a class="dropdown-item" target="_blank" href="../blocks/slider.html">Sliders</a> <a class="dropdown-item" target="_blank" href="../blocks/team.html">Team</a> <a class="dropdown-item" target="_blank" href="../blocks/testimonial.html">Testimonials</a></div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group">
                            <h3 class="link-title"><i class="fas fa-long-arrow-alt-right icon"></i> Coming soon</h3>
                            <div class="ml-5"><span class="dropdown-item text-secondary">Dividers </span><span class="dropdown-item text-secondary">Gallery </span><span class="dropdown-item text-secondary">Screenshots</span></div>
                        </div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="components">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="../components/color.html">
                                <div class="media align-items-center mb-2">
                                    <div class="bg-dark text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-palette"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Colors</h3>
                                        <p class="m-0 text-secondary">Get to know DashCore color options</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="../components/accordion.html">
                                <div class="media align-items-center mb-2">
                                    <div class="bg-success text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-bars"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Accordion</h3>
                                        <p class="m-0 text-secondary">Useful accordion elements</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="../components/cookie-law.html">
                                <div class="media align-items-center mb-4">
                                    <div class="bg-info text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-cookie-bite"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">CookieLaw</h3>
                                        <p class="m-0 text-secondary">Comply with the hideous EU Cookie Law</p>
                                    </div>
                                </div>
                            </a>
                            <h4 class="text-uppercase regular">Huge components list</h4>
                            <div class="row">
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="../components/alert.html">Alerts</a> <a class="dropdown-item" target="_blank" href="../components/badge.html">Badges</a> <a class="dropdown-item" target="_blank" href="../components/button.html">Buttons</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="../components/overlay.html">Overlay</a> <a class="dropdown-item" target="_blank" href="../components/progress.html">Progress</a> <a class="dropdown-item" target="_blank" href="../components/lightbox.html">Lightbox</a></div>
                                <div class="col mr-4"><a class="dropdown-item" target="_blank" href="../components/tab.html">Tabs</a> <a class="dropdown-item" target="_blank" href="../components/tables.html">Tables</a> <a class="dropdown-item" target="_blank" href="../components/typography.html">Typography</a></div>
                            </div>
                        </div>
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="../components/wizard.html">Wizard <span class="badge badge-pill badge-primary">New</span></a> <span class="dropdown-item d-flex align-items-center text-muted">Timeline <i class="fas fa-ban ml-auto"></i></span> <span class="dropdown-item d-flex align-items-center text-muted">Process <i class="fas fa-ban ml-auto"></i></span></div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="blog">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group">
                            <div class="row">
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Full width</h4><a class="dropdown-item" target="_blank" href="../blog/blog-post.html">Single post</a> <a class="dropdown-item" target="_blank" href="../blog/blog-grid.html">Posts Grid</a>
                                </div>
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Sidebar left</h4><a class="dropdown-item" target="_blank" href="../blog/blog-post-sidebar-left.html">Single post</a> <a class="dropdown-item" target="_blank" href="../blog/blog-grid-sidebar-left.html">Posts Grid</a>
                                </div>
                                <div class="col mr-4">
                                    <h4 class="regular text-uppercase">Sidebar right</h4><a class="dropdown-item" target="_blank" href="../blog/blog-post-sidebar-right.html">Single post</a> <a class="dropdown-item" target="_blank" href="../blog/blog-grid-sidebar-right.html">Posts Grid</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="st-dropdown-section" data-dropdown="shop">
                    <div class="st-dropdown-content">
                        <div class="st-dropdown-content-group"><a class="dropdown-item" target="_blank" href="../shop/home.html">
                                <div class="media align-items-center">
                                    <div class="bg-success text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-shopping-basket"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Home</h3>
                                        <p class="m-0 text-secondary">Online store home with an outstanding UX</p>
                                    </div>
                                </div>
                            </a><a class="dropdown-item" target="_blank" href="../shop/cart.html">
                                <div class="media align-items-center">
                                    <div class="bg-info text-contrast icon-md center-flex rounded-circle mr-3"><i class="fas fa-shopping-cart"></i></div>
                                    <div class="media-body">
                                        <h3 class="link-title m-0">Cart</h3>
                                        <p class="m-0 text-secondary">Online store shopping cart</p>
                                    </div>
                                </div>
                            </a></div>
                        <div class="st-dropdown-content-group">
                            <h3 class="link-title"><i class="fas fa-money-check-alt icon"></i> Checkout</h3>
                            <div class="ml-5"><a class="dropdown-item text-secondary" target="_blank" href="../shop/checkout-customer.html">Customer <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="../shop/checkout-shipping.html">Shipping Information <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="../shop/checkout-payment.html">Payment Methods <i class="fas fa-angle-right ml-2"></i> </a><a class="dropdown-item text-secondary" target="_blank" href="../shop/checkout-confirmation.html">Order Review <i class="fas fa-angle-right ml-2"></i></a></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </nav>
    <main>
        <header class="page header text-contrast overlay gradient gradient-purple-blue alpha-8 image-background cover" style="background-image: url('../img/bg/waves.jpg')">
            <div class="container">
                <div class="row">
                    <div class="col-md-6">
                        <h1 class="display-4 text-contrast mb-4">Accordion</h1>
                        <p class="lead text-contrast">Using the card component, you can extend the default collapse behavior to create an accordion.</p>
                    </div>
                </div>
            </div>
        </header>
        <section class="section b-b">
            <div class="container">
                <div class="section-heading text-center">
                    <h2 id="examples">Default</h2>
                </div>
                <div class="row">
                    <div class="col-md-8 mx-auto">
                        <div class="accordion" id="accordion-default">
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#dfl-q1"><i class="fas fa-angle-down angle"></i>What does the package include?</a></h5>
                                </div>
                                <div id="dfl-q1" class="collapse" data-parent="#accordion-default">
                                    <div class="card-body">When you buy Dashcore, you get all you see in the demo but the images. We include SASS files for styling, complete JS files with comments, all HTML variations. Besides we include all mobile PSD mockups.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#dfl-q2"><i class="fas fa-angle-down angle"></i>What is the typical response time for a support question?</a></h5>
                                </div>
                                <div id="dfl-q2" class="collapse" data-parent="#accordion-default">
                                    <div class="card-body">Since you report us a support question we try to make our best to find out what is going on, depending on the case it could take more or les time, however a standard time could be minutes or hours.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#dfl-q3"><i class="fas fa-angle-down angle"></i>What do I need to know to customize this template?</a></h5>
                                </div>
                                <div id="dfl-q3" class="collapse" data-parent="#accordion-default">
                                    <div class="card-body">Our documentation give you all you need to customize your copy. However you will need some basic web design knowledge (HTML, Javascript and CSS)</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#dfl-q4"><i class="fas fa-angle-down angle"></i>Can I suggest a new feature?</a></h5>
                                </div>
                                <div id="dfl-q4" class="collapse" data-parent="#accordion-default">
                                    <div class="card-body">Definitely <span class="bold">Yes</span>, you can contact us to let us know your needs. If your suggestion represents any value to both we can include it as a part of the theme or you can request a custom build by an extra cost. Please note it could take some time in order for the feature to be implemented.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section b-b">
            <div class="container">
                <div class="section-heading text-center">
                    <h2 id="examples">Accordion Clean</h2>
                </div>
                <div class="row">
                    <div class="col-md-8 mx-auto">
                        <div class="accordion accordion-clean" id="accordion-light">
                            <div class="card mb-3">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-q1"><i class="fas fa-angle-down angle"></i>What does the package include?</a></div>
                                <div id="lgt-q1" class="collapse" data-parent="#accordion-light">
                                    <div class="card-body">When you buy Dashcore, you get all you see in the demo but the images. We include SASS files for styling, complete JS files with comments, all HTML variations. Besides we include all mobile PSD mockups.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-q2"><i class="fas fa-angle-down angle"></i>What is the typical response time for a support question?</a></div>
                                <div id="lgt-q2" class="collapse" data-parent="#accordion-light">
                                    <div class="card-body">Since you report us a support question we try to make our best to find out what is going on, depending on the case it could take more or les time, however a standard time could be minutes or hours.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-q3"><i class="fas fa-angle-down angle"></i>What do I need to know to customize this template?</a></div>
                                <div id="lgt-q3" class="collapse" data-parent="#accordion-light">
                                    <div class="card-body">Our documentation give you all you need to customize your copy. However you will need some basic web design knowledge (HTML, Javascript and CSS)</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-q4"><i class="fas fa-angle-down angle"></i>Can I suggest a new feature?</a></div>
                                <div id="lgt-q4" class="collapse" data-parent="#accordion-light">
                                    <div class="card-body">Definitely <span class="bold">Yes</span>, you can contact us to let us know your needs. If your suggestion represents any value to both we can include it as a part of the theme or you can request a custom build by an extra cost. Please note it could take some time in order for the feature to be implemented.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section b-b">
            <div class="container">
                <div class="section-heading text-center">
                    <h2 id="examples">Accordion Collapsed</h2>
                </div>
                <div class="row">
                    <div class="col-md-6">
                        <p class="b-b pb-2 mb-5 text-secondary">Collapsed Default</p>
                        <div class="accordion accordion-collapsed" id="accordion-collapsed">
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clp-q1"><i class="fas fa-angle-down angle"></i>What does the package include?</a></div>
                                <div id="clp-q1" class="collapse" data-parent="#accordion-collapsed">
                                    <div class="card-body">When you buy Dashcore, you get all you see in the demo but the images. We include SASS files for styling, complete JS files with comments, all HTML variations. Besides we include all mobile PSD mockups.</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clp-q2"><i class="fas fa-angle-down angle"></i>What is the typical response time for a support question?</a></div>
                                <div id="clp-q2" class="collapse" data-parent="#accordion-collapsed">
                                    <div class="card-body">Since you report us a support question we try to make our best to find out what is going on, depending on the case it could take more or les time, however a standard time could be minutes or hours.</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clp-q3"><i class="fas fa-angle-down angle"></i>What do I need to know to customize this template?</a></div>
                                <div id="clp-q3" class="collapse" data-parent="#accordion-collapsed">
                                    <div class="card-body">Our documentation give you all you need to customize your copy. However you will need some basic web design knowledge (HTML, Javascript and CSS)</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clp-q4"><i class="fas fa-angle-down angle"></i>Can I suggest a new feature?</a></div>
                                <div id="clp-q4" class="collapse" data-parent="#accordion-collapsed">
                                    <div class="card-body">Definitely <span class="bold">Yes</span>, you can contact us to let us know your needs. If your suggestion represents any value to both we can include it as a part of the theme or you can request a custom build by an extra cost. Please note it could take some time in order for the feature to be implemented.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-6">
                        <p class="b-b pb-2 mb-5 text-secondary">Collapsed Clean</p>
                        <div class="accordion accordion-clean accordion-collapsed" id="accordion-collapsed-clean">
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-clp-q1"><i class="fas fa-angle-down angle"></i>What does the package include?</a></div>
                                <div id="lgt-clp-q1" class="collapse" data-parent="#accordion-collapsed-clean">
                                    <div class="card-body">When you buy Dashcore, you get all you see in the demo but the images. We include SASS files for styling, complete JS files with comments, all HTML variations. Besides we include all mobile PSD mockups.</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-clp-q2"><i class="fas fa-angle-down angle"></i>What is the typical response time for a support question?</a></div>
                                <div id="lgt-clp-q2" class="collapse" data-parent="#accordion-collapsed-clean">
                                    <div class="card-body">Since you report us a support question we try to make our best to find out what is going on, depending on the case it could take more or les time, however a standard time could be minutes or hours.</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-clp-q3"><i class="fas fa-angle-down angle"></i>What do I need to know to customize this template?</a></div>
                                <div id="lgt-clp-q3" class="collapse" data-parent="#accordion-collapsed-clean">
                                    <div class="card-body">Our documentation give you all you need to customize your copy. However you will need some basic web design knowledge (HTML, Javascript and CSS)</div>
                                </div>
                            </div>
                            <div class="card">
                                <div class="card-header"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#lgt-clp-q4"><i class="fas fa-angle-down angle"></i>Can I suggest a new feature?</a></div>
                                <div id="lgt-clp-q4" class="collapse" data-parent="#accordion-collapsed-clean">
                                    <div class="card-body">Definitely <span class="bold">Yes</span>, you can contact us to let us know your needs. If your suggestion represents any value to both we can include it as a part of the theme or you can request a custom build by an extra cost. Please note it could take some time in order for the feature to be implemented.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <section class="section b-b">
            <div class="container">
                <div class="section-heading text-center">
                    <h2 id="examples">Colored</h2>
                    <p class="lead">Fancy colored accordion?<br>Add <code>.accordion-[primary|secondary|success|danger|warning|info|light|dark]</code>, for color the accordion.</p>
                    <div class="dropdown" id="demo-accordion-theme-selector"><button class="btn dropdown-toggle" type="button" data-toggle="dropdown" id="accordion-theme-current">Info</button>
                        <div class="dropdown-menu"><a class="dropdown-item" href="#" data-color="primary">Primary</a> <a class="dropdown-item" href="#" data-color="secondary">Secondary</a> <a class="dropdown-item" href="#" data-color="success">Success</a> <a class="dropdown-item" href="#" data-color="danger">Danger</a> <a class="dropdown-item" href="#" data-color="warning">Warning</a> <a class="dropdown-item" href="#" data-color="info">Info</a> <a class="dropdown-item" href="#" data-color="light">Light</a> <a class="dropdown-item" href="#" data-color="dark">Dark</a> <a class="dropdown-item" href="#" data-color="alternate">Alternate</a> <a class="dropdown-item" href="#" data-color="contrast">Contrast</a> <a class="dropdown-item" href="#" data-color="darker">Darker</a> <a class="dropdown-item" href="#" data-color="black">Black</a></div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-8 mx-auto">
                        <div class="accordion" id="accordion-colored" data-current="info">
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clr-q1"><i class="fas fa-angle-down angle"></i>What does the package include?</a></h5>
                                </div>
                                <div id="clr-q1" class="collapse" data-parent="#accordion-colored">
                                    <div class="card-body">When you buy Dashcore, you get all you see in the demo but the images. We include SASS files for styling, complete JS files with comments, all HTML variations. Besides we include all mobile PSD mockups.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clr-q2"><i class="fas fa-angle-down angle"></i>What is the typical response time for a support question?</a></h5>
                                </div>
                                <div id="clr-q2" class="collapse" data-parent="#accordion-colored">
                                    <div class="card-body">Since you report us a support question we try to make our best to find out what is going on, depending on the case it could take more or les time, however a standard time could be minutes or hours.</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clr-q3"><i class="fas fa-angle-down angle"></i>What do I need to know to customize this template?</a></h5>
                                </div>
                                <div id="clr-q3" class="collapse" data-parent="#accordion-colored">
                                    <div class="card-body">Our documentation give you all you need to customize your copy. However you will need some basic web design knowledge (HTML, Javascript and CSS)</div>
                                </div>
                            </div>
                            <div class="card mb-3">
                                <div class="card-header">
                                    <h5 class="mb-0"><a href="#" class="card-title btn" data-toggle="collapse" data-target="#clr-q4"><i class="fas fa-angle-down angle"></i>Can I suggest a new feature?</a></h5>
                                </div>
                                <div id="clr-q4" class="collapse" data-parent="#accordion-colored">
                                    <div class="card-body">Definitely <span class="bold">Yes</span>, you can contact us to let us know your needs. If your suggestion represents any value to both we can include it as a part of the theme or you can request a custom build by an extra cost. Please note it could take some time in order for the feature to be implemented.</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </section>
        <footer class="site-footer section text-center bg-light">
            <div class="divider-shape" style="top: -80px;">
                <!-- mountains --> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1000 100" preserveAspectRatio="none" style="transform: translateX(-50%) rotate3d(1,0,0,180deg);height: 80px;">
                    <path class="shape-fill shape-fill-light" opacity="0.33" d="M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z" />
                    <path class="shape-fill shape-fill-light" opacity="0.66" d="M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z" />
                    <path class="shape-fill shape-fill-light" d="M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z" /></svg></div>
            <div class="container py-5">
                <div class="row align-items-center">
                    <div class="col-md-6 text-center mx-auto"><img src="../img/logo.png" alt="" class="logo">
                        <h2 class="extra-bold text-dark mb-4">DashCore</h2>
                        <p class="mt-2 mb-0 text-secondary small">© 2018 <a class="brand bold" target="_blank" href="https://5studios.net">5studios.net</a>. All Rights Reserved</p>
                    </div>
                </div>
            </div>
        </footer>
    </main><!-- themeforest:js -->
    <script src="../js/01.cookie-consent-util.js"></script>
    <script src="../js/02.1.cookie-consent-themes.js"></script>
    <script src="../js/02.2.cookie-consent-custom-css.js"></script>
    <script src="../js/02.3.cookie-consent-informational.js"></script>
    <script src="../js/02.4.cookie-consent-opt-out.js"></script>
    <script src="../js/02.5.cookie-consent-opt-in.js"></script>
    <script src="../js/02.6.cookie-consent-location.js"></script>
    <script src="../js/card.js"></script>
    <script src="../js/counterup2.js"></script>
    <script src="../js/index.js"></script>
    <script src="../js/noframework.waypoints.js"></script>
    <script src="../js/odometer.min.js"></script>
    <script src="../js/prism.js"></script>
    <script src="../js/simplebar.js"></script>
    <script src="../js/swiper.js"></script>
    <script src="../js/popper.js"></script>
    <script src="../js/jquery.js"></script>
    <script src="../js/jquery.easing.min.js"></script>
    <script src="../js/jquery.validate.js"></script>
    <script src="../js/jquery.smartWizard.js"></script>
    <script src="../js/plugins/jquery.animatebar.js"></script>
    <script src="../js/feather.min.js"></script>
    <script src="../js/bootstrap.js"></script>
    <script src="../js/aos.js"></script>
    <script src="../js/typed.js"></script>
    <script src="../js/jquery.magnific-popup.js"></script>
    <script src="../js/cookieconsent.min.js"></script>
    <script src="../js/common-script.js"></script>
    <script src="../js/forms.js"></script>
    <script src="../js/stripe-bubbles.js"></script>
    <script src="../js/stripe-menu.js"></script>
    <script src="../js/cc.js"></script>
    <script src="../js/pricing.js"></script>
    <script src="../js/shop.js"></script>
    <script src="../js/svg.js"></script>
    <script src="../js/site.js"></script>
    <script src="../js/03.demo.js"></script><!-- endinject -->
</body>

</html>